import React, { Component } from 'react';
import { Link } from 'react-router-dom';

class Mysql extends Component {
    state = { 
        contents: [
            {id: 1, title: "Grammar"},
            {id: 2, title: "Rules"},
            {id: 3, title: "Install"},
        ]
    } 
    render() { 
        return (<React.Fragment>
            <ul className="list-group m-2">
                <li className="list-group-item active" aria-current="true">MySQL</li>
                {this.state.contents.map(content => (
                    <li key={content.id} className="list-group-item"><Link to={`/mysql/content?id=${content.id}&in=${content.title}`} style={{textDecoration: "none"}}>{content.id}. {content.title}</Link></li>
                ))}
            </ul>
        </React.Fragment>);
    }
}
 
export default Mysql;